<template>
	<view class="content">
		<view class="from-item-box">
			<input type="text" v-model="formInfo.real_name" placeholder="姓名" placeholder-style="color:#ccc">
		</view>
		<view class="from-item-box">
			<input type="number" v-model="formInfo.phone" maxlength="11" placeholder="电话号码" placeholder-style="color:#ccc">
		</view>
		<view class="from-item-box" @click="show = true">
			<input type="text" v-model="city" placeholder="省/市/区" disabled="true" placeholder-style="color:#000">
			<view class="sele-icon-box">
				<image src="/pageMember/static/icon7.png" mode="heightFix"></image>
			</view>
		</view>
		<view class="from-item-box">
			<input type="text" v-model="formInfo.address" placeholder="街道和地址信息" placeholder-style="color:#ccc">
		</view>
		<view class="default-box">
			<u-form-item label="设为默认地址：" label-width="230" :border-bottom="false">
				<u-switch slot="right" v-model="switchVal" @change="change" active-color="#000"></u-switch>
			</u-form-item>
		</view>
		<view class="bottom-but-box" v-if="formInfo.address_id==0||isOk" @click="bindSubmit(1)"><text>添加</text></view>
		<block v-else>
			<view class="bottom-but-box" @click="bindSubmit(2)"><text>保存</text></view>
			<view class="bottom-but-box del" @click="bindDelAddress"><text>删除地址</text></view>
		</block>
		<u-picker mode="region" v-model="show" :area-code='["0", "0", "0"]' @confirm="confirm"></u-picker>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		data(){
			return {
				show:false, //isShowPrcker
				switchVal:0,//默认che
				city:"",//用户所选城市
				isOk:0,
				formInfo:{ //用户信息
					address_id:"",
					real_name:"",
					phone:"",
					province:"",
					city:"",
					area:"",
					address:"",
					is_default:""
				}
			}
		},
		onLoad(options) {
			uni.setNavigationBarTitle({
				title:options.status==0?'添加地址':'编辑地址'
			})
			this.switchVal = options.status==0||options.isOk==1?1:0;
			this.formInfo.is_default = this.switchVal;
			this.formInfo.address_id = options.status;//获取用户从我的地址列表传过来的地址ID；
			this.formInfo.phone==""?this.formInfo.phone = uni.getStorageSync('userInfo').mobile:""; //默认获取用户的手机号
			this.isOk = options.isOk;
			this.getMyWxAddress();
			this.getMyAddressInfo();
		},
		methods:{
			confirm(e){ //得到选择的值
				this.formInfo.province = e.province.label;
				this.formInfo.city = e.city.label;
				this.formInfo.area = e.area.label;
				this.city = `${e.province.label}/${e.city.label}/${e.area.label}`;
			},
			change(e){ //是否设为默认地址
				this.formInfo.is_default = Number(e);
			},
			bindSubmit(status){ //表单提交
				let {real_name,phone,address,is_default} = this.formInfo;
				let reg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
				if(real_name==""){
					this.$showToast("请填写您的姓名");
					return
				}
				if (phone == '' || phone == undefined || phone == null) {
					this.$showToast("请输入您的电话号码");
					return
				} else {
				  if ((!reg.test(phone)) && phone != '') {
					this.$showToast("请输入正确的电话号码");
					return
				  }
				}
				if(this.city==""){
					this.$showToast("请选择所在城市");
					return
				}
				if(address==""){
					this.$showToast("请输入详细地址");
					return
				}
				console.log('用户填写的地址：',this.formInfo);
					this.$u.api.saveUserAddApi(this.formInfo).then(res=>{
						if(res.code==1){
							console.log('上传：',res);
							this.$refs.uToast.show({title: res.message,position:'center'});
							setTimeout(()=>{
								uni.navigateBack({})
							},1500)
						}
					});
			},
			// getDefaultAddress(){ //得到默认地址
				// let {address_id,is_default} = this.formInfo;
				// if(address_id==0||is_default==0){
				// 	return;
				// }else{
				// 	this.$u.api.setDefaultAddApi({address_id:address_id}).then(res=>{
				// 		if(res.code==1){
				// 			console.log('设置默认：',res);
				// 		}
				// 	});
				// }
			// },
			getMyAddressInfo(){ //获取用户编辑地址信息
				let addressId = this.formInfo.address_id;
				console.log(addressId,'----');
				if(addressId==0||addressId==undefined){
					return
				}else{
					this.$u.api.getAddressApi({address_id:addressId}).then(res=>{
						if(res.code==1){
							let data = res.data;
							let {address_id,real_name,phone,province,city,is_default} = data;
							this.formInfo = {address_id,real_name,phone,province,city,is_default};
							this.formInfo.area = data.district;
							this.formInfo.address = data.detail;
							this.switchVal = data.is_default;
							this.city = `${data.province}/${data.city}/${data.district}`;
							console.log('我的信息：',this.formInfo);
						}
					});
				}
			},
			getMyWxAddress(){ //获取用户微信地址
				let _this = this;
				if(Boolean(this.isOk)){
					uni.chooseAddress({
						success(res) {
							_this.formInfo.real_name = res.userName;
							_this.formInfo.phone = res.telNumber;
							_this.formInfo.province = res.provinceName;
							_this.formInfo.city =  res.provinceName==res.cityName?'市辖区':res.cityName;
							_this.formInfo.area = res.countyName;
							_this.formInfo.address = res.detailInfo;
							_this.city = `${_this.formInfo.province}/${_this.formInfo.city}/${_this.formInfo.area}`;
						}
					})
				}else{
					return;
				}
			},
			bindDelAddress(){ //删除地址
				let _this = this;
				uni.showModal({
					title:'确定要删除该地址吗？',
					showCancel:true,
					confirmColor:'#000',
					success(res) {
						if(res.confirm){
							_this.$u.api.delAddressApi({address_id:_this.formInfo.address_id}).then(res=>{
								if(res.code==1){
									_this.$refs.uToast.show({title: '删除成功',position:'center'});
									setTimeout(()=>{
										uni.navigateBack({})
									},1500)
								}
							});
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content{
		width: 100%;
		height: 100vh;
		overflow: hidden;overflow-y: auto;
		font-family: Microsoft YaHei;
		box-sizing: border-box;
		padding: 0 40rpx;
		.from-item-box{
			position: relative;
			padding-top: 50rpx;
			border-bottom: 1rpx solid #eee;
			.sele-icon-box{
				position: absolute;top: 90%;right: 2rpx;
				transform: translateY(-90%);
				image{width: 30rpx;height: 30rpx;}
			}
			input{
				width: 100%;
				height: 70rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: #333333;
				padding-right: 30rpx;
				box-sizing: border-box;
			}
		}
		.default-box{margin-top: 30rpx;}
		.bottom-but-box{
			margin-top: 50rpx;
			padding: 25rpx 0;
			background: #000;
			font-size: 30rpx;
			font-weight: 400;
			color: #FFFFFF;
			text-align: center;
			border-radius: 50rpx;
			margin-bottom: 30rpx;
		}
		.del{
			background: none !important;
			border: 1rpx solid #000 !important;
			color: #000 !important;
		}
	}
</style>